﻿
@{
    ViewBag.Title = "Liquidar";
}
<h1>@ViewBag.empleado.Nombre  @ViewBag.empleado.Apellido</h1>
<div>
    <form name="liquidar" method="post" action="@Url.Action("CrearLiquidacion", "Liquidacion", new { id = ViewBag.empleado.IdEmpleado })">
        <input type="text" name="basico" id="basico" size="30" class="text-input" placeholder="Básico"    />
        <input type="text" name="dias" id="dias" size="5"  class="text-input" placeholder="Días"  />
<fieldset>
		<table class="table table-bordered">
			<thead>
				<tr>
					<th>Concepto</th>
					<th>Unidades</th>
					<th>Remunerativo</th>
					<th>No remunerativo</th>
				</tr>
			</thead>	
            <tr>
                <td>Basico</td>
                <td>24</td>
                <td id="basicoRemunerativo"></td>
                <td>0</td>
            </tr>
            <tr>
                <td>Categoria</td>
                <td>@ViewBag.empleado.Categoria.ToString()</td>
                <td id="categoria"></td>
                <td>0</td>
            </tr>
            <tr>
                <td>Aporte Obra Social</td>
                <td>3%</td>
                <td></td>
                <td id="aporteSocial"></td>
            </tr>
            <tr>
                <td>Aporte AFJP</td>
                <td>3%</td>
                <td></td>
                <td id="aporteAfjp"></td>
            </tr>
            <tr>
                <td>Aporte Jubilatorio</td>
                <td>11%</td>
                <td></td>
                <td id="aporteJubilatorio"></td>
            </tr>
			<thead>
				<tr>
					<th class="warning" colspan="2"><b>Sub Total</b></th>
					<th class="warning" id="subtotalRemun"></th>
					<th class="warning" id="Subtotal"></th>
				</tr>
				<tr>
					<th class="success" colspan="3"><b>Neto</b></th>
					<th class="success" id="total"><b></b></th>
				</tr>
			</thead>
    </table>
</fieldset>
<br />
<button class="btn btn-success" onclick="alertar()">Confirmar Liquidacion</button>
<a class="btn btn-danger" href="@Url.Action("Index","Liquidador")">Cancelar</a>
</form>
</div>

@* con javascript logramos que la tabla se actualice con los montos ingresados
    sin la necesidad de refrescar la pagina*@
<script>

    function alertar() {
        alert("Recuerde que esta liquidacion no puede deshacerse");
    }
    window.onload = function () {
        
        //se le ortoga foco al input de básico
        document.getElementById("basico").focus();

        // se crean las variables y se le asigna lo que se ingresó
        var basico = document.getElementById("basico"),
        dias = document.getElementById("dias");

        //con el evento onChange del input "dias" me aseguro que solo se realicen las operaciones
        //de la tabla cuando se modifique el contenido de ese input
        dias.onchange = function () {

            //variables con sus respectivos calculos
            var parcial = (basico.value / 24) * dias.value;
            var jubilacion = ((basico.value / 24) * dias.value) * 0.11;
            var social = ((basico.value / 24) * dias.value) * 0.03;
            var afjp = ((basico.value / 24) * dias.value) * 0.03;
            var categoria;
            var noRemunerativo = jubilacion + social + afjp;
            
            //se agrega a la tabla los valores
            document.getElementById("basicoRemunerativo").appendChild(document.createTextNode(parcial));
            document.getElementById("aporteJubilatorio").appendChild(document.createTextNode(jubilacion));
            document.getElementById("aporteSocial").appendChild(document.createTextNode(social));
            document.getElementById("aporteAfjp").appendChild(document.createTextNode(afjp));
            document.getElementById("Subtotal").appendChild(document.createTextNode(noRemunerativo));
            if ("@ViewBag.empleado.Categoria" == "Junior") {
                categoria = parcial * 0.03;
                document.getElementById("categoria").appendChild(document.createTextNode(categoria));
            }
            else if ("@ViewBag.empleado.Categoria" == "SemiSenior") {
                categoria = parcial * 0.06;
                document.getElementById("categoria").appendChild(document.createTextNode(categoria));
            }
            else if ("@ViewBag.empleado.Categoria" == "Senior") {
                categoria = parcial * 0.1;
                document.getElementById("categoria").appendChild(document.createTextNode(categoria));
            }
            var remunerativo = parcial + categoria;
            var total = remunerativo - noRemunerativo;
            document.getElementById("subtotalRemun").appendChild(document.createTextNode(parcial + categoria));
            document.getElementById("total").appendChild(document.createTextNode(remunerativo - noRemunerativo));

       }

    }

</script>
